import { createRouter, createWebHistory } from 'vue-router'
import HelloWorld from '../components/HelloWorld.vue'

const router = createRouter({
  // 直接使用根路径 '/'
  history: createWebHistory('/'),
  routes: [
    {
      path: '/',
      name: 'home',
      component: HelloWorld
    },
    {
      path: '/hollow-text-generator',
      name: 'hollow-text-generator',
      component: () => import('../views/hollow-text-generator.vue')
    },
    {
      path: '/special-characters',
      name: 'special-characters',
      component: () => import('../views/special-characters.vue')
    },
    {
      path: '/wing-nickname-generator',
      name: 'wing-nickname-generator',
      component: () => import('../views/wing-nickname-generator.vue')
    },
    {
      path: '/chinese-character-dismantling',
      name: 'chinese-character-dismantling',
      component: () => import('../views/chinese-character-dismantling.vue')
    },
    {
      path: '/random-avatar-generator',
      name: 'random-avatar-generator',
      component: () => import('../views/random-avatar-generator.vue')
    },
    {
      path: '/image-upscaler',
      name: 'image-upscaler',
      component: () => import('../views/image-upscaler.vue')
    },
    {
      path: '/text-to-image',
      name: 'text-to-image',
      component: () => import('../views/text-to-image.vue')
    },
    {
      path: '/image-cropper',
      name: 'image-cropper',
      component: () => import('../views/image-cropper.vue')
    },
    {
      path: '/image-color-picker',
      name: 'image-color-picker',
      component: () => import('../views/image-color-picker.vue')
    },
    {
      path: '/grid-image-cutter',
      name: 'grid-image-cutter',
      component: () => import('../views/grid-image-cutter.vue')
    },
    {
      path: '/national-day-avatar-generator',
      name: 'national-day-avatar-generator',
      component: () => import('../views/national-day-avatar-generator.vue')
    },
    {
      path: '/image-converter',
      name: 'image-converter',
      component: () => import('../views/image-converter.vue')
    },
    {
      path: '/idiom-completion',
      name: 'idiom-completion',
      component: () => import('../views/idiom-completion.vue')
    },
    {
      path: '/image-base64-converter',
      name: 'image-base64-converter',
      component: () => import('../views/image-base64-converter.vue')
    },
    {
      path: '/sql-formatter',
      name: 'sql-formatter',
      component: () => import('../views/sql-formatter.vue')
    },
    {
      path: '/url-encoder-decoder',
      name: 'urlEncoderDecoder',
      component: () => import('../views/url-encoder-decoder.vue')
    },
    {
      path: '/unix-timestamp-converter',
      name: 'unixTimestampConverter',
      component: () => import('../views/unix-timestamp-converter.vue')
    },
    {
      path: '/code-diff',
      name: 'codeDiff',
      component: () => import('../views/code-diff.vue')
    },
    {
      path: '/unicode-converter',
      name: 'unicodeConverter',
      component: () => import('../views/unicode-converter.vue')
    },
    {
      path: '/image-compressor',
      name: 'imageCompressor',
      component: () => import('../views/image-compressor.vue')
    },
    {
      path: '/string-concatenation',
      name: 'stringConcatenation',
      component: () => import('../views/string-concatenation.vue')
    },
    {
      path: '/image-to-gif',
      name: 'imageToGif',
      component: () => import('../views/image-to-gif.vue')
    },
    {
      path: '/gif-editor',
      name: 'gifEditor',
      component: () => import('../views/gif-editor.vue')
    },
    {
      path: '/dynamic-colorful-text',
      name: 'dynamicColorfulText',
      component: () => import('../views/dynamic-colorful-text.vue')
    },
    {
      path: '/qr-code-generator',
      name: 'qrCodeGenerator',
      component: () => import('../views/qr-code-generator.vue')
    },
    {
      path: '/schedule',
      name: 'schedule',
      component: () => import('../views/schedule.vue')
    },
    {
      path: '/blurred-nickname',
      name: 'blurred-nickname',
      component: () => import('../views/blurred-nickname-generator.vue')
    },
    {
      path: '/mini-house',
      name: 'mini-house',
      component: () => import('../views/mini-house.vue')
    },
    {
      path: '/css-generator',
      name: 'css-generator',
      component: () => import('../views/css-generator.vue')
    },
    {
      path: '/typing-practice',
      name: 'typing-practice',
      component: () => import('../views/typing-practice.vue')
    },
    {
      path: '/barcode-generator',
      name: 'barcode-generator',
      component: () => import('../views/barcode-generator.vue')
    },
    {
      path: '/chinese-converter',
      name: 'chinese-converter',
      component: () => import('../views/chinese-converter.vue')
    },
    {
      path: '/image-rotator',
      name: 'image-rotator',
      component: () => import('../views/image-rotator.vue')
    },
    {
      path: '/template-puzzle',
      name: 'template-puzzle',
      component: () => import('../views/template-puzzle.vue')
    },
    {
      path: '/math-problem-generator',
      name: 'math-problem-generator',
      component: () => import('../views/MathProblemGenerator.vue')
    },
    {
      path: '/age-calculator',
      name: 'age-calculator',
      component: () => import('../views/AgeCalculator.vue')
    },
    {
      path: '/pinyin-alphabet',
      name: 'pinyin-alphabet',
      component: () => import('../views/PinyinAlphabet.vue')
    },
    {
      path: '/chinese-zodiac',
      name: 'chinese-zodiac',
      component: () => import('../views/ChineseZodiac.vue')
    },
    {
      path: '/writing-practice',
      name: 'writing-practice',
      component: () => import('../views/WritingPractice.vue')
    }
  ]
})

export default router
